import React, { useState } from 'react';
import { Button, Col, Layout, Row } from "antd"
import { Typography } from 'antd';
import ScriptEdit from "@/components/ScriptEdit";
const { Content } = Layout;
export default (props) => {

    const { onRun, result } = props;
    const { Paragraph } = Typography;
    const [innerRecord, setInnerRecord] = useState({ code:"" });

    return <>
        <Content style={{ overflow: "auto" }}>

            <Row >
                <Col >
                    <Button style={{ marginLeft: "10px" }}
                        onClick={() => {
                            onRun(innerRecord.code)
                        }}
                        type='primary' >执行</Button>
                </Col>
               
            </Row>

        </Content>
    
        <ScriptEdit
            onValueChange={async (value) => {
                setInnerRecord({ ...value });
            }}
            loading={false}
            record={{ ...innerRecord }}
        />
        {result.length > 0 ? <Row style={{ padding: "12px" }}>
            <Col>
                <Paragraph >执行结果:</Paragraph>
            </Col>
            {result.map((item, index) => {
                // eslint-disable-next-line react/no-array-index-key
                return <Col span={24} key={`cc${index}`}>
                    <Paragraph ><div dangerouslySetInnerHTML={{ __html: item.replace(/\n/g, '<br />').replace(/\r/g, '') }} /></Paragraph>
                </Col>
            })}
        </Row> : null}


    </>
}